﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="OCompleteMacNGReportPageHighcharts.aspx.cs" Inherits="IHISCETeim.Web.MachineSys.MacModel.OCompleteMacNGReportPageHighcharts" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        html, body, div, span, applet, object, iframe,
         h3, h4, h5, h6, p, blockquote, pre,
        a, abbr, acronym, address, big, cite, code,
        del, dfn, em, font, img, ins, kbd, q, s, samp,
        small, strike, strong, sub, sup, tt, var,
        dl, dt, dd, ol, ul, li,
        fieldset, form, label, legend,
        table, caption, tbody, tfoot, thead, tr, th, td { padding:0; margin:0; font-size:12px; line-height:100%; font-family:Arial, sans-serif;}
        table{}
        .table{ border:1px solid #000; border-collapse:collapse;}
        .table th{ text-align:center; line-height:25px;border:1px solid #000;}
        .table td{  line-height:16px;border:1px solid #000; padding-left:3px;}
        h1{ clear:both; line-height:25px; height:25px; font-size:22px; font-weight:bold;}
        h2{ clear:both; line-height:22px; height:22px; font-size:16px; font-weight:normal;}
    </style>
    <script src="../js/jquery-1.4.4.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="../Highcharts/js/highcharts.js"></script>
    <script type="text/javascript" src="../Highcharts/js/themes/grid.js"></script>
    <%-- 一. 一次性能检测合格台数--%>
    <script type="text/javascript">
        var chart;
        $(document).ready(function () {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'report1container',
                    type: 'line',
                    marginRight: 20,
                    marginBottom: 35
                },
                title: {
                    text: '性能检测一次合格率,<%=Year %>年'
                },
                xAxis: {
                    categories:  <%=GetReport1JSCategories() %>
                },
                yAxis: {
                    title: {
                        text: '百分比'
                    }
                },
                tooltip: {
                    formatter: function () {
                        return '<b>' + this.series.name + '</b><br/>' + this.x + ': ' + this.y +'%';
                    }
                },
		        plotOptions: {
			        line: {
				        dataLabels: {
					        enabled: true,
                            formatter: function() {
	                            return this.y+'%';
                            }
				        }
			        }
		        },

                legend: {
                    enabled: false
                },
                series: <%=GetReport1JSSeries() %>
            });
        });

    </script>
    <%-- 一. 一次出入库检查合格台数--%>
    <script type="text/javascript">
        var chart;
        $(document).ready(function () {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'report2container',
                    type: 'line',
                    marginRight: 20,
                    marginBottom: 35
                },
                title: {
                    text: '出入库检查一次合格率,<%=Year %>年'
                },
                xAxis: {
                    categories:  <%=GetReport2JSCategories() %>
                },
                yAxis: {
                    title: {
                        text: '百分比'
                    }
                },
                tooltip: {
                    formatter: function () {
                        return '<b>' + this.series.name + '</b><br/>' + this.x + ': ' + this.y +'%';
                    }
                },
		        plotOptions: {
			        line: {
				        dataLabels: {
					        enabled: true,
                            formatter: function() {
	                            return this.y+'%';
                            }
				        }
			        }
		        },

                legend: {
                    enabled: false
                },
                series: <%=GetReport2JSSeries() %>
            });
        });

    </script>
    <%--二.各机型不良率  性能测试品异对比分析表--%>
    <script type="text/javascript">
        var chart;
        $(document).ready(function () {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'report3container_1',
                    type: 'line',
                    marginRight: 80,
                    marginBottom: 25
                },
                title: {
                    text: '性能测试品异对比分析表,<%=Year %>年'
                },
                xAxis: {
                    categories:  <%=GetReport3_1JSCategories() %>
                },
                yAxis: {
                    title: {
                        text: '不良率(%)'
                    }
                },
                tooltip: {
                    formatter: function () {
                        return '<b>' + this.series.name + '</b><br/>' +this.x + ': ' + this.y + '%';
                    }
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'top',
                    x: -10,
                    y: 100,
                    borderWidth: 0
                },
		        plotOptions: {
			        line: {
				        dataLabels: {
					        enabled: true,
                            formatter: function() {
	                            return this.y+'%';
                            }
				        }
			        }
		        },
                series: <%=GetReport3_1JSSeries() %>
            });
        });

    </script>
    <%--二.各机型不良率  出入库品异对比分析表--%>
    <script type="text/javascript">
        var chart;
        $(document).ready(function () {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'report3container_2',
                    type: 'line',
                    marginRight: 80,
                    marginBottom: 25
                },
                title: {
                    text: '出入库品异对比分析表,<%=Year %>年'
                },
                xAxis: {
                    categories:  <%=GetReport3_2JSCategories() %>
                },
                yAxis: {
                    title: {
                        text: '不良率(%)'
                    }
                },
                tooltip: {
                    formatter: function () {
                        return '<b>' + this.series.name + '</b><br/>' +this.x + ': ' + this.y + '%';
                    }
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'top',
                    x: -10,
                    y: 100,
                    borderWidth: 0
                },
		        plotOptions: {
			        line: {
				        dataLabels: {
					        enabled: true,
                            formatter: function() {
	                            return this.y+'%';
                            }
				        }
			        }
		        },
                series: <%=GetReport3_2JSSeries() %>
            });
        });

    </script>
    <%--三.生产口质信息表--%>
    <script type="text/javascript">
        var chart;
        $(document).ready(function () {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'report4container',
                    type: 'column'
                },
                title: {
                    text: '生产品质信息统计表,<%=Year %>年'
                },
                xAxis: {
                    labels: {
				        rotation: -55,
				        align: 'right',
				        style: {
					        font: 'normal 12px Verdana, sans-serif'
				        }
                    },
                    categories: <%=GetReport4JSCategories() %>
                },
                yAxis: {
                    min: 0,
                    title: {
                        text: '问题发现次数'
                    }
                },
                legend: {
                    enabled: false
                },
                tooltip: {
                    formatter: function () {
                        return '' +this.x + ': ' + this.y + '次';
                    }
                },
                plotOptions: {
                    column: {
                        pointPadding: 0.2,
                        borderWidth: 0,
                        dataLabels: {
					        enabled: true,
                            formatter: function() {
	                            return this.y;
                            }
				        }
                    }
                },
                series: <%=GetReport4JSSeries() %>
            });
        });

    </script>
    <%--四.重点问题汇总--%>
    <script type="text/javascript">
        var chart;
        $(document).ready(function () {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'report5container_2',
                    plotBackgroundColor: null,
			        plotBorderWidth: null,
			        plotShadow: false  ,                  
                    marginRight: 280
                },
                title: {
                    text: '重点问题汇总, <%=Year %>-<%=Month %>'
                },
                tooltip: {
                    formatter: function () {
                        return '<b>' + this.point.name + '</b>: ' + Math.round( this.percentage) + ' %';
                    }
                },
                legend:{
                    enabled:true,
                    align:'right',
                    floating:true,
                    verticalAlign:'top',
                    layout:"vertical",
                    x:-30,
                    y:20,
                    width:200,
                    itemWidth: 90
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        showInLegend:true,
                        dataLabels: {
                            enabled: true,
                            color: '#000000',
                            distance: -10,
                            formatter: function () {
                                return  Math.round( this.percentage) + ' %';
                            }
                        }
                    }
                },
                series: [{
                    type: 'pie',
                    name: '重点问题',
                    data: <%=GetReport5JSSeriesData() %>
                }]
            });
        });

    </script>
    <%--五.外协件(性能测试与出入库检查)品异汇总--%>
    <script type="text/javascript">
        var chart;
        $(document).ready(function () {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'report6container_2',
                    type: 'column'
                },
                title: {
                    text: '外协件(性能测试与出入库检查)品异统计表,<%=Year %>-<%=Month %>'
                },
                xAxis: {
                    labels: {
				        rotation: -55,
				        align: 'right',
				        style: {
					        font: 'normal 12px Verdana, sans-serif'
				        }
                    },
                    categories: <%=GetReport6JSCategories() %>
                },
                yAxis: {
                    min: 0,
                    title: {
                        text: '问题发生次数'
                    }
                },
                legend: {
                    enabled: false
                },
                tooltip: {
                    formatter: function () {
                        return '' +this.x + ': ' + this.y + '次';
                    }
                },
                plotOptions: {
                    column: {
                        pointPadding: 0.2,
                        borderWidth: 0,
                        dataLabels: {
					        enabled: true,
                            formatter: function() {
	                            return this.y;
                            }
				        }
                    }
                },
                series: <%=GetReport6JSSeries() %>
            });
        });

    </script>
</head>
<body>
    <div id="container" style="width:1000px;margin: 0 auto">
        <div style="width:1000px; text-align:center; line-height:30px; height:30px; font-size:30px; font-weight:bold; "><%=Year %>年<%=Month %>月完成机器问题分析统计报表</div>
        <h1>一.生产一次合格率</h1>
        <h2>1.一次性能检测合格台数 <%=OInspection_GetReport1(Year, Month)["NotNGCount"]%>台,性能检测台数：<%=OInspection_GetReport1(Year,Month)["AllCount"]%>台.一次性能检测合格率：<%=Convert.ToDecimal(OInspection_GetReport1(Year,Month)["FPY"]).ToString("F1")%>%（一次性能检测合格数/性能检测台数X100%）.</h2>
        <div id="report1container" style="width:600px;height:300px;">
            report1container
        </div>
        <h2>2.一次出入库检查合格台数：<%=OInspection_GetReport2(Year, Month)["NotNGCount"]%>台,出入库台数：<%=OInspection_GetReport2(Year,Month)["AllCount"]%>台.一次出入库合格率：<%=Convert.ToDecimal(OInspection_GetReport2(Year,Month)["FPY"]).ToString("F1")%>%（一次出入库合格数/出入库台数X100%）.</h2>
        <div id="report2container" style="width:600px;height:300px;">
            report2container
        </div>

        <h1>二.各机型不良率</h1>
        <div>
            <div id="report3container_1" style="width:450px;height:300px; float:left;">
                report3container_1
            </div>

            <div id="report3container_2" style="width:450px;height:300px; float:right;">
                report3container_2
            </div>
        </div>

        <h1>三.生产品质信息表</h1>
        <div id="report4container" style="width:900px; height:300px; ">
            report4container
        </div>
        <%=GetShowDataTable()%>
<br/><br/><br/>
        <h1>四.重点问题汇总</h1>
        <div id="report5container">
            <div id="report5container_1" style="width:300px;float:left;">
                <asp:repeater id="rpreport4container" runat="server">
                    <HeaderTemplate>
                        <table class="table" >
                        <thead>
                            <tr  >  
                                <th width="150" align="center">
                                    项目
                                </th>
                                <th width="160">
                                    频率(不良次数/不良总数)
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                     </HeaderTemplate>
                     <ItemTemplate>
                            <tr target="sid_user" >			
				                <td><%# Eval("Exceptionrecord")%></td>
				                <td align="center"><%# Eval("NGCount")%> / <%# Eval("ALLNGCount")%></td>
			                </tr>
                     </ItemTemplate>
                     <FooterTemplate>
                          </tbody>
                       </table>
                     </FooterTemplate>
                    </asp:repeater>
            </div>

            <div id="report5container_2" style="width:650px;margin: 0 auto; float:right;">
                report5container_2
            </div>
        </div>

        <h1>五.外协件(性能测试与出入库检查)品异汇总</h1>
        <div >
            <div id="report6container_1" style="width:300px;float:left;">
                <asp:repeater id="rpreport6container" runat="server">
                    <HeaderTemplate>
                        <table class="table" >
                        <thead>
                            <tr  >  
                                <th width="80" align="center">
                                    供应商
                                </th>
                                <th width="150">
                                    主要问题
                                </th>
                                <th width="80">
                                    次数
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                     </HeaderTemplate>
                     <ItemTemplate>
                            <tr target="sid_user" >			
				                <td><%# Eval("Supplier")%></td>
				                <td><%# Eval("topngitm")%></td>
                                <td align="center"><%# Eval("NGCount")%></td>
			                </tr>
                     </ItemTemplate>
                     <FooterTemplate>
                          </tbody>
                       </table>
                     </FooterTemplate>
                    </asp:repeater>
            </div>

            <div id="report6container_2" style="width:650px;height:300px;margin: 0 auto; float:right;">
                report6container_2
            </div>
        </div>
    </div>
</body>
</html>
